<template>
  <el-dialog
    top="50px"
    title="拒绝说明"
    append-to-body
    :close-on-click-modal="false"
    :before-close="handleClose"
    :visible.sync="visible"
  >
    <div class="d-flex align-items-center mb-3">
      <div>拒绝人：</div>
      <div>
        {{ rejectName }}
      </div>
    </div>
    <div class="d-flex">
      <div>项目拒绝理由：</div>
      <div class="form-control-ml">
        <el-input
          v-model="editData.item_confuse_des"
          rows="5"
          placeholder="输入拒绝理由"
          type="textarea"
        ></el-input>
      </div>
    </div>
    <div class="text-center mt-2">
      <el-button @click="handleReject" type="primary" :loading="submitLoading" class="btn-long">
        完成
      </el-button>
      <el-button @click="handleClose" class="btn-long">取消</el-button>
    </div>
  </el-dialog>
</template>

<script>
import { mapGetters } from 'vuex'
export default {
  components: {},
  props: {
    visible: Boolean,
    queryId: String,
  },
  data() {
    return {
      editData: {},
      submitLoading: false,
    }
  },
  computed: {
    ...mapGetters(['org', 'user', 'userId']),
    rejectName() {
      return this.org.orgName + '-' + this.user.realName
    },
  },
  watch: {},
  mounted() {},
  created() {},
  methods: {
    handleClose() {
      this.editData = {}
      this.$emit('update:visible', false)
    },
    handleReject() {
      if (!this.editData.item_confuse_des) {
        return this.$message.warning('请输入拒绝说明')
      }
      const data = {
        item_status: 2, // 状态
        item_person: this.userId,
        item_person_name: this.user.realName,
        item_date: this.$utils.dateFormat(new Date(), 'yyyy.MM.dd hh:mm:ss'),
        item_confuse_des: this.editData.item_confuse_des,
      }
      this.submitLoading = true
      this.$api
        .updateData(this.$serviceName, 'customer_related', this.queryId, data)
        .then(() => {
          this.$emit('success', true)
          this.handleClose()
          this.$message.success('项目已拒绝')
        })
        .catch(() => {
          this.$message.error('项目拒绝失败')
        })
        .finally(() => {
          this.submitLoading = false
        })
    },
  },
}
</script>
<style lang="scss" scoped></style>
